<template>
	<div>
	<el-form ref="process" :model="form" label-width="110px" label="right">
	  <el-form-item label="流程名称:">
	    <el-input v-model="form.name"></el-input>
	  </el-form-item>
	  <el-form-item label="流程分类:" prop="processCategory">
	    <el-select v-model="form.processCategory" placeholder="请选择流程分类" style="width: 100%;">
	      <el-option label="演示流程" value="test"></el-option>
	      <el-option label="订单中心" value="OFC"></el-option>
	    </el-select>
	  </el-form-item>
	  <el-form-item label="流程标识:">
	    <el-input v-model="form.id"></el-input>
	  </el-form-item>
	  <el-form-item label="流程是否自动提交:" label-width=140px>
	    <el-switch v-model="form.auto" active-value="1" active-text="是" inactive-value="0" inactive-text="否">
	    </el-switch>
	  </el-form-item>
	  <el-form-item label="节点描述:">
	    <el-input v-model="form.documentation"></el-input>
	  </el-form-item>
	  <el-form-item label="监听器:">
		  <el-badge :value="executionListenerLength">
			<el-button size="small" @click="dialogName = 'executionListenerDialog'">编辑</el-button>
		  </el-badge>
	  </el-form-item>
	  <el-form-item label="信号定义:">
	    <el-button size="small" @click="dialogName = 'executionListenerDialog'">编辑</el-button>
	  </el-form-item>
	</el-form>
	<executionListenerDialog
	v-if="dialogName === 'executionListenerDialog'"	
	:bpmnModel="bpmnModel"
	:element="element"
	@close="finishExecutionListener"
	></executionListenerDialog>
	</div>
</template>

<script>
	import {commonParse} from '../common/parseElement.js'
	import mixinPanel from '../mixins/mixinPanel.js'
	import mixinExecutionListener from '../mixins/mixinExecutionListener.js'
	export default{
		mixins:[mixinPanel,mixinExecutionListener],
		data(){
			return{
				form:{}
			}
		},
		created() {
			this.form = commonParse(this.element)
		},
		watch:{
			'form.processCategory':function(val){
				if (val === '') val = null
				this.updateProperties({'flowable:processCategory':val})
			},
			'form.auto':function(val){
				if (val === '') val = null
				this.updateProperties({'flowable:auto':val})
			},
		}
		
	}
</script>

<style  >
	label {
		font-weight: initial !important;
	}
</style>
